import Taro, {Component} from '@tarojs/taro'
import {connect} from '@tarojs/redux'
import {View, ScrollView, Picker} from '@tarojs/components'
import './index.less'
import {AtList, AtListItem} from 'taro-ui'

@connect(({recruitmentList, recruitmentDetails, loading}) => ({
  recruitmentList,
  recruitmentDetails,
  loading
}))

export default class recruitmentList extends Component {


  config = {
    navigationBarTitleText: ''
  }

  constructor(props) {
    super(props)
    this.state = {
      current: 0
    }
  }

  componentWillMount() {
  }

  componentDidMount() {
    const {dispatch} = this.props;
    const {type} = this.$router.params;
    wx.setNavigationBarTitle({
      title: '求职招聘'
    })
    dispatch({type: 'recruitmentList/initData'})
    // 获取列表数据
    dispatch({type: 'recruitmentList/loadList'})
    dispatch({type: 'recruitmentList/loadDistrict'})
  }

  choseListData(item) {
    const {dispatch} = this.props;
    dispatch({
      type: 'recruitmentDetails/updateState',
      payload: {
        listData: {
          ...item
        }
      }
    })
    Taro.navigateTo({
      url: `/pages/recruitmentDetails/index`
    })
  }

  componentWillUnmount() {
  }

  componentDidShow() {
  }

  componentDidHide() {
  }

  // 下拉滚动
  onScrollToLower(e) {
    const {
      recruitmentList, dispatch
    } = this.props;
    dispatch({
      type: 'recruitmentList/loadList',
    })
    dispatch({
      type: 'recruitmentList/updateState',
    })
  }

  render() {
    const {
      recruitmentList, dispatch
    } = this.props;
    const {current} = this.state;

    const {
      listData, districtTypeRange, type, districtType
    } = recruitmentList;
    const updateState = (obj) => {
      dispatch({
        type: 'recruitmentList/updateState',
        payload: {
          ...obj
        }
      })
    }

    const handleClick = (value) => {
      if (value === 1) {
        Taro.navigateTo({
          url: `/pages/myOrder/index`
        })
      }
    }
    return (

      <View className='recruitmentList'>
        <View className='scheduleNear'>
          <View className='top'>

            <View className={type === 0 ? 'top_btn top_active' : 'top_btn'}
                  onClick={() => {
                    dispatch({type: 'recruitmentList/initData'})
                    updateState({type: 0})
                    dispatch({type: 'recruitmentList/loadList'})
                  }}>
              求职
            </View>

            <View className={type === 1 ? 'top_btn top_active' : 'top_btn'}
                  onClick={() => {
                    dispatch({type: 'recruitmentList/initData'})
                    updateState({type: 1})
                    dispatch({type: 'recruitmentList/loadList'})
                  }}>
              招聘
            </View>

          </View>
          <View className='pick'>
            <View className='pick_child'>
              <AtList>
                <Picker mode='selector' range={districtTypeRange} rangeKey="name"
                        onChange={(e) => {
                          dispatch({type: 'recruitmentList/initData'})
                          updateState({districtType: districtTypeRange[e.detail.value]})
                          dispatch({type: 'recruitmentList/loadList'})
                        }}
                >
                  <AtListItem
                    arrow='right'
                    title='区域'
                  />
                </Picker>
              </AtList>
            </View>
          </View>
          <View className='firstList'>
            <ScrollView
              scrollY
              onScrollToLower={this.onScrollToLower.bind(this)}
              style="height:100%"
            >
              {
                listData.map((item, i) => <View className='listChild' key={i}
                                                onClick={this.choseListData.bind(this, item)}
                >
                  <View className='box_left'>
                    <image src={item.topImage&&item.topImage.startsWith("http")?item.topImage:SERVERURL+item.topImage}/>
                    {/* <View className='box_text'>{item.topImage}</View> */}
                  </View>
                  <View className='box_right'>
                    <View className='adsName'>
                      标题：{item.title}
                    </View>
                    <View className='adsName'>
                      {/* 电话：  {item.cellphone == null ?'暂无':item.cellphone}&ensp; 联系人： {item.contact} */}
                      地址： {item.districtName == null ? '暂无' : item.districtName}
                    </View>
                    <View className='detailAds'>
                      截止时间： {item.endDate}
                    </View>
                  </View>
                </View>)
              }
            </ScrollView>
          </View>
        </View>
      </View>
    )
  }
}
